class Inventory extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            thumburl: '',
            name: '',
            id: '0',
            goodsindex:0,
            goodshtml:[]
        };
    }




    componentDidMount() {
        
        this.freshlist(0)
    }
    ongoodschange(e){
        this.setState({goodsindex:e.target.value})
        this.getdata(this.state.goodlist[e.target.value].inventory)
    }

    getdata(inventory){
        var rowhtml = [],data=[];
        if(inventory!='') {
            data = inventory.split(',');
        }
        for (let index = 0; index <10 ; index++) {
            var i = index;
           if(data.length<10) data.push(0)
            if(i==9) i=10;
            var text = (30+i)+"/"+((23+i)/10).toFixed(1)+"";
            rowhtml.push(
                <div key={index} >
                    <span>{text}</span>
                    {/* value={data[index].value} */}
                    <input id={'input_'+index}   onChange={this.inputchange.bind(this,index)}
                       type="text" className="form-control input"  />
                    </div>
                )
        }
        console.log(rowhtml,'rowhtml');
        
        this.setState({rowhtml,data},()=>{
            data.forEach((x,i)=>{
                $('#input_'+i).val(x)
            })
        })
    }

    freshlist(index) {
        getlist(res=>{
            if(res.issuccess==1){
                var goodshtml = [];
                res.list.forEach((x,i) => {
                    goodshtml.push(
                        <option key={i} value={i}>{x.name}/{x.describe}
                    </option>
                    )
                });
            }
            this.setState({goodshtml,goodlist:res.list})
            this.getdata(res.list[index].inventory)
        })
    }
    
    inputchange(index,e){
        
        var {data} = this.state;
        data[index]=Number(e.target.value);
        this.setState({data})
        console.log(index,'inputchange--index');
        console.log(e.target.value,'inputchange--e');
        
    }
   
    submit() {
        var { goodlist, goodsindex,data } = this.state, err = '';
        
        
        submitintentory({id:goodlist[goodsindex].id,intentory:data.join(',')},res=>{
            if(res.issuccess==1){
                alert('保存成功!')
                this.freshlist(goodsindex)
            }
        })
       
    }
   
    

    render() {
        var {rowhtml} =this.state;
        return (

            <div className='content_wrap panel-default content_wrap'>
                <div className='breadLine '>
                    当前位置 > 商品管理 > 库存管理
                        </div>
                <div className='inputs panel-body'>
                    <h3>库存管理</h3>

                </div>

            <div className="input-group">
                <span className="input-group-addon desc">选择商品</span>
                <select value={this.state.index} onChange={this.ongoodschange.bind(this)} className="form-control select">
                    {this.state.goodshtml}
                </select>
            </div>

            <div className="input-group size">
                <span className="input-group-addon desc">编辑库存</span>
                <div className='items'>
                {rowhtml}
                </div>
               
                {/* <div className='item'> 
                <span>31/2.4</span>
                <input onChange={this.inputchange.bind(this,0)} value={data[0]}  type="text" className="form-control input"  />
                </div>
                <div className='item'> 
                <span>32/2.5</span>
                <input onChange={this.inputchange.bind(this,0)} value={data[0]}  type="text" className="form-control input"  />
                </div> */}
                <div></div>

<div className='btns_bottom center'>
    <button  className='btn add btn-primary center w20' onClick={this.submit.bind(this)}  id='btnimg_save'>保存</button>
    </div>
            </div>
                </div >
            )
    }
}

ReactDOM.render(

    <div>
        <TopLine/>
        {/* <LeftMenu code='3'/> */}
        <LeftMenu code='inventory'/>
        <Inventory/>
        </div>
,$('.container')[0]
)